<template>
    <div class="index-sort">
        <template v-for="(sort, index) in sortList">
            <p
                class="index-sort-list"
                :class="{'index-sort-active' : activeName == sort.tabVal}"
                :key="index"
                @click="handleSort(sort.tabVal)"
            >
                {{ sort.name }}
            </p>
        </template>
    </div>
</template>

<script>
export default {
    props: {
        sortList: {
            type: Array,
            default: () => {
                return []
            }
        }
    },
    data () {
        return {
            activeName: ''
        }
    },
    mounted () {
        this.init()
    },
    methods: {
        /* 初始化 */
        init () {
            this.activeName = this.sortList[0].tabVal
        },

        /* tab切换 */
        handleSort (name) {
            this.activeName = name
        }
    }
}
</script>

<style lang="less" scoped>

</style>
